<template>
  <yk-drawer placement="right" :show="active" @close="closes" :title="'私信' + count">
    <yk-space dir="vertical">
      <replyView v-for="item in messages" :key="item.id" :content="item" @delete="deleteMessage(item.id)"
        :isComment="false">
      </replyView>
    </yk-space>
    <template #footer>
      <yk-pagination :total="count" simple @change="changePage" :default-page-size="props.pageSize" />
    </template>
  </yk-drawer>
</template>

<script setup lang="ts">
import { toRefs } from 'vue';
import type { InformationProps } from './type';
import { onMounted, ref, getCurrentInstance } from 'vue'
import replyView from './replyView.vue';
import { messageAPI, deleteMessageAPI } from '@/api';
import { useUserStore } from '@/stores/user';
import { useCode } from '@/hooks/code';

const userStore = useUserStore()
const { tackleCode } = useCode()

const proxy: any = getCurrentInstance()?.proxy

const props = withDefaults(defineProps<InformationProps>(), {
  active: false,
  pageSize: 4,
})

const emits = defineEmits(['close'])
const { active } = toRefs(props)
const closes = () => {
  emits('close', false)
}

// 总数
const count = ref<number>(123)

// 数据内容
const messages = ref()

// 请求
type Request = {
  token?: string,
  pageSize: number,
  nowPage: number,
  count?: boolean
}

const request: Request = {
  pageSize: props.pageSize,
  nowPage: 1,
  token: userStore.token
}



// 获取数据
const getData = async (e: boolean) => {


  request.count = e
  const res: any = await messageAPI(request)
  if (tackleCode(res.code)) {
    if (res.data.count !== -1) {
      count.value = res.data.count
    }
    messages.value = res.data.result

  }


}
// 分页查询
const changePage = (e: number) => {
  request.nowPage = e
  getData(false)
}



// 删除私信
const deleteMessage = async (e: number) => {
  const request = {
    token: userStore.token,
    id: e
  }
  const res: any = await deleteMessageAPI(request)
  if (tackleCode(res.code)) {
    messages.value = messages.value.filter((item: any) => item.id !== e)
    proxy.$message({
      type: 'primary',
      message: '删除成功'
    })
  } else {
    proxy.$message({
      type: 'danger',
      message: res.msg || '删除失败'
    })
  }


}

onMounted(() => {
  getData(true)
})


</script>

<style scoped lang="less"></style>
